import React from 'react';
import { Link,withRouter }from 'react-router-dom';
import Util from 'util/mm.jsx';
import User from 'service/user-service.jsx';

const _util = new Util();
const _user = new User();

class TopNav extends React.Component{
	constructor(props){
		super(props);
		this.state = {
			userInfo:_util.getStorage('userInfo') || ''
		}
	}
	
	logout(){
		_user.logout()
			 .then(res => {
				 _util.removeStorage('userInfo');
				 // this.props.history.push('/login');
				 window.location.href = '/#/login';
			 },errMsg => {
				 _util.errorTips(errMsg);
			 })
	}
	
	render(){
		return (
			<div className="navbar navbar-default top-navbar" role="navigation">
            <div className="navbar-header">
                <Link className="navbar-brand" to="/"><b>DEMON </b>Mall</Link>
            </div>

            <ul className="nav navbar-top-links navbar-right">
                <li className="dropdown">
                    <a className="dropdown-toggle" data-toggle="dropdown" href="#" aria-expanded="false">
                        <i className="fa fa-user fa-fw"></i> 
						{
							this.state.userInfo.username
							? <span>欢迎,{this.state.userInfo.username}</span>
							: <span>欢迎您</span>
						}
						
						<i className="fa fa-caret-down"></i>
                    </a>
                    <ul className="dropdown-menu dropdown-user">
                        <li onClick={this.logout.bind(this)}>
							<a href="#">
								<i className="fa fa-sign-out fa-fw"></i>
								<span>退出登录</span>
							</a>
                        </li>
                    </ul>
                </li>
            </ul>
        </div>
		
		)
	}
	
}
export default TopNav;